<template>
	<view>
		<view class="list-view">
			<radio-group @change="onChange">
				<view class="list-item" v-for="(item,index) in list">
					<radio color="#2EB0D9" :value="item"></radio>
					<image :src="item.pictureName"></image>
					<div class="right">
						<div class="top">
							<div class="name">{{item.nurseName}}</div>
							<div class="phone">{{item.tel}}</div>
						</div>
						<div class="bottom">{{item.hospitalName}}</div>
					</div>
				</view>
			</radio-group>
			<uni-load-more :status="status"></uni-load-more>
		</view>
		<view class="bottom-fixed-view">
			<view class="submit-btn" @click="submit">确认派发</view>
		</view>
	</view>
</template>

<script>
	import PageInfo from '../../utils/pageutils'
	import * as nurseInfo from '../../common/api/nurseInfo.js'
	import * as orderInfo from '../../common/api/orderInfo.js'
	export default {
		data() {
			return {
				pageInfo:new PageInfo(),
				list:[],
				status:'more',
				current:null,
				uid:'',
			}
		},
		onLoad(opt) {
			if(opt.uid){
				this.uid = opt.uid
			}
			this.refresh()
		},
		onPullDownRefresh() {
			this.refresh()
		},
		onReachBottom() {
			this.loadMore()
		},
		methods: {
			refresh(){
				this.pageInfo.reset()
				this.list = []
				this.status = 'loading'
				this.getList()
			},
			loadMore(){
				if(this.pageInfo.isNotLoadAll){
					this.status = 'loading'
					this.pageInfo.nextPage()
					this.getList()
				}else{
					this.status = 'noMore'
				}
			},
			getList(){
				const param = {
					pageIndex:this.pageInfo.pageIndex,
					pageSize:this.pageInfo.pageSize,
					...this.form
				}
				nurseInfo.queryByPage(param).then(result => {
					const list = result.data.data.rows || []
					const total = result.data.data.total
					this.list = [...this.list,...list]
					this.pageInfo.total = total
					this.pageInfo.loadedTotal = this.list.length
					setTimeout(()=>{
						if(this.pageInfo.isNotLoadAll){
							this.status = 'more'
						}else{
							this.status = 'noMore'
						}
						uni.stopPullDownRefresh()
					},200)
				}).catch(error => {
					console.log(error);
				})
			},
			onChange(e){
				this.current = e.detail.value
			},
			submit(){
				if(this.current === null){
					uni.showToast({
						icon:'none',
						title:'请选择护士'
					})
					return
				}
				uni.showModal({
					title: '提示',
					content: '确认提交？',
					success:(res) => {
						if (res.confirm) {
							console.log('用户点击确定');
							const param = {
								uid:this.uid,
								dispatchNursesUid:this.current.uid,
								dispatchNurses:this.current.nurseName,
								nursesPhone:this.current.tel,
								paymentStatus:'待出发'
							}
							orderInfo.update(param).then(result => {
								uni.navigateBack()
							}).catch(error => {
								console.log(error);
							})
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.list-view{
		width: 100%;
		box-sizing: border-box;
		padding: 10rpx;
		padding-bottom: 80rpx;
	}
	.list-item{
		width:100%;
		padding: 20rpx 10rpx;
		box-sizing: border-box;
		background: white;
		display: flex;
		align-items: center;
		margin-top: 10rpx;
		radio{
			transform: scale(0.7);
		}
		image{
			width: 120rpx;
			height: 120rpx;
			border-radius: 50%;
		}
		.right{
			margin-left: 10rpx;
			.top{
				display:flex;
				color: #232323;
				font-size: 30rpx;
				font-weight: bold;
				.name{}
				.phone{
					margin-left: 10rpx;
				}
			}
			.bottom{
				color: #232323;
				font-size: 26rpx;
			}
		}

	}
	
	.bottom-fixed-view{
		position: fixed;
		bottom: 0;
		background: #F9F9F9;
		width: 100%;
		box-sizing: border-box;
		padding:10rpx;
		.submit-btn{
			background: #2EB0D9;
			color: white;
			width: 100%;
			height: 80rpx;
			display: flex;
			align-items: center;
			justify-content: center;
			border-radius: 40rpx;
		}
	}
	
</style>
